<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@ include file="../common/header.jsp"%>
<style>
    #_iSelVal_province{
        display: none;
    }

    #_iSelVal_city{
        display: none;
    }

    #_iSelVal_county{
        display: none;
    }
</style>
<script type="application/javascript" src="/static/webjars/layui/layui.js"></script>


<div id="saper-container">
    <div id="saper-bd">
        <div class="subfiled clearfix">
            <h2 class="layui-col-md3">重点事件分类添加</h2>

            <div class="layui-col-md2 layui-btn" style="background-color:#6ec673; float: right;height: 30px;margin-top: 1px;line-height: 30px;width: 60px;margin-right: 10px;margin-left: 2px;" onclick="refresh('thing_category_manage')">
                返回
            </div>
        </div>
    </div>

</div>


<form class="layui-form" id="add-key-category" style="padding-top: 10px">
    <div class="layui-col-md12">
        <div class="layui-form-item">
            <label class="layui-form-label">事件名：</label>
            <div class="layui-input-block" >
                <input type="text" name="event_name" placeholder="必填" required  lay-verify="required" autocomplete="off" class="layui-input" />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">事件类别：</label>
            <div class="layui-input-block" >
                <input type="text" name="event_type" placeholder="必填" required  lay-verify="required" autocomplete="off" class="layui-input" />
            </div>
        </div>


        <div class="layui-col-md12" style="height: 15px;"></div>

        <div class="row">
            <div class="layui-col-md1" style="width: 110px;">
                <label class="layui-form-label">详细地址：</label>
            </div>
            <dlv class="layui-col-md11" style="width: calc(100% - 110px)">
                <div class="layui-input-inline">
                    <select name="province" id="province" lay-filter="province">

                        <option value="">四川省</option>

                    </select>
                </div>
                <div class="layui-input-inline">
                    <select name="city" id="city" lay-filter="city">
                        <option value="">宜宾市</option>
                    </select>
                </div>
                <div class="layui-input-inline">
                    <select name="county" id="county" lay-filter="county">
                        <option value="">兴文县</option>
                    </select>
                </div>
                <div class="layui-input-inline">
                    <select name="town" id="town" lay-filter="town"></select>
                </div>
                <div class="layui-input-inline">
                    <select name="village" id="village" lay-filter="village"></select>
                </div>
                <div class="layui-input-inline">
                    <input type="text" name="address" id="address" placeholder="详细地址" required  lay-verify="required" autocomplete="off" class="layui-input" />
                </div>
            </dlv>
        </div>

        <div class="layui-col-md12" style="height: 15px;"></div>

        <div class="layui-form-item">
            <label class="layui-form-label">关注日期：</label>
            <div class="layui-input-block" >
                <input name="event_time" type="text" placeholder="关注日期" required  lay-verify="required" autocomplete="off" class="layui-input" id="born" />
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">管理人名：</label>
            <div class="layui-input-block" >
                <input type="text" name="maname" placeholder="必填" required  lay-verify="required" autocomplete="off" class="layui-input" />
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">联系方式：</label>
            <div class="layui-input-block" >
                <input type="text" name="tellphone" placeholder="必填" required  lay-verify="required" autocomplete="off" class="layui-input" />
            </div>
        </div>

    </div>


    <div class="layui-col-md12">

        <div class="layui-form-item" style="text-align: center">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="keycategory-form" id="submit">保存</button>
                <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </div>

</form>


<%@ include file="../common/footer.jsp"%>

<script type="application/javascript">
    layui.use('form', function() {
        $("div").removeClass("iselect-wrapper");
        //时间戳
        var nowtimestamp = (new Date()).getTime();
        var layer = layui.layer;
        var form = layui.form;
        var laydate = layui.laydate;
        var upload = layui.upload;

        laydate.render({
            elem: '#born' //指定元素
        });

        $.fn.serializeObject = function() {
            var o = {};
            var a = this.serializeArray();
            $.each(a, function() {
                if (o[this.name]) {
                    if (!o[this.name].push) {
                        o[this.name] = [ o[this.name] ];
                    }
                    o[this.name].push(this.value || '');
                } else {
                    o[this.name] = this.value || '';
                }
            });
            return o;
        };


        var dddd = new Date();
        console.log(dddd.getFullYear() + "-" + dddd.getMonth() + "-" + dddd.getDay());//获取系统当前时间

        $.post("/ajax/pub/gettown", {code: 1},
            function (result) {
                //输出
                //执行清空
                $("#town").empty();
                $("#village").empty();
                for (i = 0; i < result.length; i++) {
                    document.getElementById("town").options.add(new Option(result[i].townName, result[i].townId));
                }
                form.render();
            }
        );

        $.post("/ajax/pub/getvillage", {code: 1},
            function (result) {
                //输出
                //执行清空
                $("#village").empty();
                for (i = 0; i < result.length; i++) {
                    document.getElementById("village").options.add(new Option(result[i].villageName, result[i].villageName));
                }
                form.render();
            }
        );

        //初始化乡镇
        form.on('select(town)', function (data) {
            console.log(data.value);
            $.post("/ajax/pub/getvillage", {code: data.value},
                function (result) {
                    //输出
                    //执行清空
                    $("#village").empty();
                    for (i = 0; i < result.length; i++) {
                        document.getElementById("village").options.add(new Option(result[i].villageName, result[i].villageName));
                    }
                    form.render();
                }
            );
        });

        form.on('submit(keycategory-form)', function (data) {  //保存选项

            data.field.time = dddd.getFullYear() + "-" + dddd.getMonth() + 1 + "-" + dddd.getDate();
            data.field.time = dddd.toLocaleString();

            layer.msg("提交中");
            data.field.province = $("#province option:selected").text();
            data.field.city = $("#city option:selected").text();
            data.field.county = $("#county option:selected").text();
            data.field.town = $("#town option:selected").text();
            data.field.village = $("#village option:selected").text();



            data.field.event_area = data.field.province  + data.field.city + data.field.county  + data.field.town + data.field.village  + data.field.address;

            console.log(data);

            $.ajax({
                url: "/ajax/save/keycategory",
                type: "POST",
                contentType: 'application/json;charset=utf-8',
                //设置请求头信息
                dataType: "json",
                data: JSON.stringify(data.field),
                success: function (data) {
                    layer.msg(data.code);
                    nowtimestamp = (new Date()).getTime();
                    form.render();
                },
                error: function (res) {
                    layer.msg(res);
                }
            });
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        function timestampToTime(timestamp) {
            var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
            Y = date.getFullYear() + '-';
            M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
            D = date.getDate() + ' ';
            h = date.getHours() + ':';
            m = date.getMinutes() + ':';
            s = date.getSeconds();
            return Y+M+D+h+m+s;
        }
    });
</script>